﻿<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<title>自定义分享</title>
	<link href="css/mui.min.css" rel="stylesheet" />
	<script src="https://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>

	<style>
		ul {
			font-size: 14px;
			color: #8f8f94;
		}

		.mui-btn {
			padding: 10px;
		}
	</style>
</head>

<body>
<header class="mui-bar mui-bar-nav" style="padding-right: 15px;">
	<h1 class="mui-title">自定义分享</h1>
</header>
<div class="mui-content">
	<div class="mui-content-padded">

		<div class="mui-input-row">
			<label></label>

		</div>

		<div class="mui-input-row">
			<label></label>

		</div>
		<div class="mui-input-row">
			<label></label>

		</div>
		<div class="mui-input-row">
			<label></label>

		</div>

		<div class="mui-input-row">
			<label></label>

		</div>
		<div class="mui-input-row">
			<label></label>

		</div>
		<div class="mui-input-row">
			<label></label>

		</div>

		<div class="mui-content-padded">
			<button id='share' onclick="share()" class="mui-btn mui-btn-block mui-btn-danger">微信朋友圈</button>
			<button id='friends' onclick="friends()" class="mui-btn mui-btn-block mui-btn-danger">微信分享</button>

		</div>

	</div>
</div>
<script src="js/mui.min.js"></script>
<script src="js/app.js"></script>
<script type="text/javascript" src="js/common.js"></script>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/layer/3.0.1/layer.min.js"></script>
<script>
    var appId = '';
    var timestamp = 0; //为了让后台传过来的timetamp是数字类型 否则字符串 估计又会报config fail错误
    var nonceStr = '';
    var signature = '';

    $(document).ready(function() {

        var paramStr = {};
        paramStr.url = window.location.href;
        var params = {};
        params.paramStr = JSON.stringify(paramStr);

        Common.ajaxWithParam("/fenful/api/v1/common/getWxConfig",params, function(returnData) {
            console.log(returnData);
            appId = returnData.appId;
            timestamp = returnData.timestamp;
            nonceStr = returnData.nonceStr;
            signature = returnData.signature;

            console.log(appId);

            wx.config({ //开始微信的配置 将获取的数据拿去请求
                debug: false,
                appId: appId,
                timestamp: timestamp,
                nonceStr: nonceStr,
                signature: signature,
                jsApiList: [ //可以调用下面的接口 我们这里只是调用scanQRCode 也就是扫码接口

                    'onMenuShareTimeline', 'onMenuShareAppMessage'

                ]
            });

            wx.ready(function(res) {
                console.log("successs!");
            });

            wx.error(function(res) {

            });
        });

        /*
         * 注意：
         * 1. 所有的JS接口只能在公众号绑定的域名下调用，公众号开发者需要先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。
         * 2. 如果发现在 Android 不能分享自定义内容，请到官网下载最新的包覆盖安装，Android 自定义分享接口需升级至 6.0.2.58 版本及以上。
         * 3. 常见问题及完整 JS-SDK 文档地址：http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html
         *
         * 开发中遇到问题详见文档“附录5-常见错误及解决办法”解决，如仍未能解决可通过以下渠道反馈：
         * 邮箱地址：weixin-open@qq.com
         * 邮件主题：【微信JS-SDK反馈】具体问题
         * 邮件内容说明：用简明的语言描述问题所在，并交代清楚遇到该问题的场景，可附上截屏图片，微信团队会尽快处理你的反馈。
         */

    });




    wx.ready(function () {
        wx.onMenuShareTimeline({
            title: "快来跟我一起分享百万大奖",// 分享标题
            desc: "精彩分呈世界杯活动！！！！",
            link: location.href, // 分享链接
            imgUrl: "http://owtm7tpz8.bkt.clouddn.com/worldcup.jpg", // 分享图标
            success: function () {
                // alert("成功");
            },
            cancel: function () {
                // alert("失败")
            }
        });
        wx.onMenuShareAppMessage({
            title: "快来跟我一起分享百万大奖", // 分享标题
            desc: "精彩分呈世界杯活动！！！！",
            link: location.href, // 分享链接
            imgUrl: "http://owtm7tpz8.bkt.clouddn.com/worldcup.jpg", // 分享图标
            success: function () {
                // alert("成功");
            },
            cancel: function () {
                // alert("失败")
            }
        });
	});

    





</script>
</body>

</html>